package view.components
{
	import assets.view.components.TabButtonViewSymbol;
	
	import flash.display.Graphics;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.text.TextFieldAutoSize;
	
	import model.vo.ViewVO;
	
	import view.icons.ColapseExpandIconView;

	public class TabButtonView extends TabButtonViewSymbol
	{
		public static const NAME:String 				= "TabButtonView";
		public static const CLICKED:String				= NAME + "Clicked";
		public static const COLAPSED:String				= NAME + "Colpased";
		public static const EXPANDED:String				= NAME + "Expanded";
		public static const EXPANDING:String			= NAME + "Expanding";
		
		private var buttonData:Object;
		
		private var buttonText:String;
		
		private var bckgrdColor:Number;
		private var bckgrdSelectColor:Number;
		private var bckgrdOverColor:Number;
		
		private var labelColor:Number;
		private var labelSelectColor:Number;
		private var labelOverColor:Number;
		
		private var frameColor:Number;
		private var frameStroke:Number;
		
		private var buttonWidth:Number;
		private var buttonHeight:Number;
		
		private var btnIndex:int;
		
		private var viewData:ViewVO;
		
		private var colapseExpandIcon:ColapseExpandIconView;
		private var tabButtonSelected:Boolean;
		
		public function TabButtonView()
		{
			this.alpha = 0;
			this.buttonMode = true;
		}
		
		public function init( data:Object, viewVO:ViewVO, ndx:int ):void
		{
			buttonData = data;
			viewData = viewVO;
			
			btnIndex = ndx;
			
			setTabButtonViewProperties();
			buildTabButtonView();
			align();
			
			this.addEventListener( MouseEvent.MOUSE_DOWN, mouseDownHandler );
			
			addEvents();
		}
		
		public function select():void
		{
			removeEvents();
			
			FX.tint( bckgrdContainer, bckgrdSelectColor );
			label.textColor = labelSelectColor;
			
			FX.addShadow( label, true );
			FX.addShadow( colapseExpandIcon, true );
			
			tabButtonSelected = true;
		}
		
		public function unselect():void
		{
			addEvents();
			
			FX.tint( bckgrdContainer, bckgrdColor );
			label.textColor = labelColor;
			
			colapseExpandIcon.unselect();
			
			FX.removeFilters( label );
			FX.removeFilters( colapseExpandIcon );
			
			tabButtonSelected = false;
		}
		
		public function align():void
		{
			label.y = Math.round( ( frameContainer.height / 2 ) - ( label.height / 2 ) );
			colapseExpandIcon.x = Math.round( frameContainer.width - colapseExpandIcon.width - 10 );
			colapseExpandIcon.y = Math.round( frameContainer.height / 2 );
		}
		
		private function setTabButtonViewProperties():void
		{
//			buttonText 			= buttonData.@name;
			buttonText 			= buttonData.label;
			
			labelColor 			= viewData.labelColor;
			labelSelectColor	= viewData.labelSelectedColor;
			labelOverColor 		= viewData.labelOverColor;
			
			bckgrdColor 		= viewData.btnBckgrdColor;
			bckgrdSelectColor 	= viewData.btnBckgrdSelectedColor;
			bckgrdOverColor 	= viewData.btnBckgrdOverColor;
			
			frameColor			= viewData.frameColor;
			frameStroke			= viewData.frameWeight;
			
			buttonWidth 		= viewData.TAB_WIDTH;
			buttonHeight 		= viewData.TAB_HEIGHT;
		}
		
		private function buildTabButtonView():void
		{
			label.autoSize = TextFieldAutoSize.LEFT;
			label.text = buttonText;
//			label.border = true;
			
			paintBckgrd();
			paintCover();
			paintFrame();
			
			colapseExpandIcon = new ColapseExpandIconView();
			colapseExpandIcon.init( viewData );
			addChild( colapseExpandIcon );
		}
		
		private function paintBckgrd():void
		{
			var g:Graphics = bckgrdContainer.graphics;
			g.clear();
			g.beginFill( bckgrdColor, 1 );
			g.drawRect( 0, 0, buttonWidth, buttonHeight );
			g.endFill();
		}
		
		private function paintCover():void
		{
			var g:Graphics = coverContainer.graphics;
			g.clear();
			g.beginFill( 0xff0000, 0 );
			g.drawRect( 0, 0, buttonWidth, buttonHeight );
			g.endFill();
		}
		
		private function paintFrame():void
		{
			
			var g:Graphics = frameContainer.graphics;
			g.clear();
			g.lineStyle( frameStroke, frameColor );
			g.drawRect( 0, 0, buttonWidth, buttonHeight );
		}
		
		private function addEvents():void
		{
			this.addEventListener( MouseEvent.MOUSE_OVER, mouseOverHandler );
			this.addEventListener( MouseEvent.MOUSE_OUT, mouseOutHandler );
		}
		
		private function removeEvents():void
		{
			this.removeEventListener( MouseEvent.MOUSE_OVER, mouseOverHandler );
			this.removeEventListener( MouseEvent.MOUSE_OUT, mouseOutHandler );
		}
		
		private function colapseExpand():void
		{
			if( colapseExpandIcon.isExpanded )
			{
				FX.colapseExpand( bckgrdContainer, viewData.CONTENT_HEIGHT, colapseExpandProgressHandler, expandCompleteHandler );
			}
			else
			{
				FX.colapseExpand( bckgrdContainer, buttonHeight, colapseExpandProgressHandler );
			}
		}
		
		private function mouseDownHandler( e:MouseEvent ):void
		{
			colapseExpandIcon.colapseExpand();
			colapseExpand();
			
			if( !tabButtonSelected )
			{
				select();
				colapseExpandIcon.select();
			}
			
			dispatchEvent( new Event( CLICKED ) );
		}
		
		private function mouseOverHandler( e:MouseEvent ):void
		{
			FX.addShadow( label );
			FX.addShadow( colapseExpandIcon );
			FX.tint( bckgrdContainer, bckgrdOverColor );
			label.textColor = labelOverColor;
		}
		
		private function mouseOutHandler( e:MouseEvent ):void
		{
			FX.removeFilters( label );
			FX.removeFilters( colapseExpandIcon );
			FX.tint( bckgrdContainer, bckgrdColor );
			label.textColor = labelColor;
		}
		
		private function colapseExpandProgressHandler():void
		{
			frameContainer.width = this.width;
			
			dispatchEvent( new Event( EXPANDING ) );
		}
		
		private function expandCompleteHandler():void
		{
			dispatchEvent( new Event( EXPANDED ) );
		}
		
		public function get data():Object
		{
			return buttonData;
		}
		
		public function get index():int
		{
			return btnIndex;
		}
		
		public function get isExpanded():Boolean
		{
			return colapseExpandIcon.isExpanded;
		}
	}
}